<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 内部样式表:写在style标签中,嵌入到html内部. -->
    <!-- style标签放到哪都可以,且可以有多个style标签,习惯放到head中 -->
    <!-- CSS代码需要放到style里 -->
    <style>
        /* 选择所有的p标签 (1.基础选择器)*/
            p{
                /* 写属性,设置字体颜色 */
                color:red;
                /* 设置字体大小 */
                font-size: 30px;
            }
            div{
                color: yellow;
            }
    </style>
    <!-- 外部样式 -->
    <!-- 当CSS进一步复杂了之后,就可以把CSS单独放到一个文件中.
    然后在html中单独引入
    --
    使用link标签来引入一个外部的CSS.link href属性描述了CSS的位置.
    rel属性表示引入的文件类型.stylesheet表示"样式表",说明引入的是一个CSS文件
    没有rel属性也可以~~默认就是样式表 -->
    <link rel="stylesheet" href="demo1.CSS">
</head>
<body>
    <p>hello world</p>
    <p>hello Java</p>
    
    <!-- 行内样式 -->
    <!-- 通过标签的style属性来设置样式,不需要写选择器(只针对当前标签生效)
    最大的问题在于,不能写太复杂的样式 -->
    <!-- style属性彼style标签的优先级高  -->
    <p style="color: green;">你好</p>
</body>
</html>